
<script>
  // annotate
  // $(document).ready(function(){
  $(function(){

    $("#foo").hide()

    $("#my-open-click").click(function(){
      // $("#foo").show()
      // $("#foo").fadeIn()
      $("#foo").slideDown()
    })

    $("#my-hide-click").click(function(){
      // $("#foo").hide()
      // $("#foo").fadeOut()
      $("#foo").slideUp()

    })


  })
</script>

<%= render partial: "highlight",
   locals: {highlight: "ex2", name:"Ex2: 隐藏和打开内容"} %>


<p>
  <a href="#" id="my-open-click"> Open </a>
  <a href="#" id="my-hide-click"> Hide </a>
</p>

<div id="foo" style="border: 1px solid red;">
  <p>bar</p>
</div>
